/// <reference path="../../jquery-1.10.2.js" />
/// <reference path="../../My/JQExtend.js" />
/// <reference path="../../../MyJS/MyString.js" />

//jq设置下拉框按钮
jQuery.fn.setDropDownBtn = function (config) {
    /// <summary>设置下拉按钮</summary>
    /// <param name="bFocusFireDropFun" type="Boolean">获取焦点时，是否触发下拉事件</param>
    /// <param name="config" type="JsonObject">配置参数，参见setDropDownBtn对象</param>
    //内部闭包函数
    var initBtn = function (config) {
        var me = this;
        if (me.tagName !== "INPUT") return; //必须是input标签，才可以设置
        var id = me.id; //获取ID号
        var html = DropDownBtn.htmlTemplate;
        //要先判断指定的输入框是否存在了下拉按钮，如果存在了，则不需要再创建新的按钮了，在原先的按钮的基础上绑定事件即可。
        var obj = $('span[inputID=' + id + ']');
        if (obj.length === 0) {
            //计算位置（如果父元素的定位是绝对定位的，则需要计算位置）
            if (me.style.position === 'absolute') {
                //计算相对于父节点的便宜位置，而不要计算相对于body的相对位置
                var offset = $(this).offsetEx(this.parentNode.parentNode);
                //-17而不是18，是因为有1px的误差，搞不懂原因
                var left = offset.left + $(this).width() - 17;
                var top = offset.top;
                html = MyString.format(html, "dropDownBtn_Absolute", id);
                obj = $(html).insertAfter(me);
                //更换样式
                obj.css({
                    'left': left,
                    'top': top
                });
            }
            else {
                html = MyString.format(html, "dropDownBtn", id);
                obj = $(html).insertAfter(me);
            }
        }

        //事件独立写出来，避免重复注册事件
        var dropdownBtnClickEvent = function (e) {
            //用字符串来判断比较好处理字符串的情况
            if (me.disableAllEvent != "true") {
                if (me.fnBeforeDrop) {
                    var oFunc = new Function("inputEl", me.fnBeforeDrop);
                    oFunc(me);
                }
                if (me.fnDrop) {
                    var oFunc = new Function("inputEl", me.fnDrop);
                    oFunc(me);
                }
                if (me.fnAfterDrop) {
                    var oFunc = new Function("inputEl", me.fnAfterDrop);
                    oFunc(me);
                }
            }
        };
        //单击下拉按钮的时候，触发事件
        obj.unbind("click", dropdownBtnClickEvent);
        obj.bind("click", dropdownBtnClickEvent);

        $(me).addClass('dropdownBtnInput');

        var inputClickEvent = function (e) {
            //判断当前输入获取焦点的时候，是否应该触发下拉事件
            if (me.bFocusFireDropFun == "true") {
                if (me.disableAllEvent != "true") {
                    if (me.fnDrop) {
                        var oFunc = new Function("inputEl", me.fnDrop);
                        oFunc(me);
                    }
                }
            }
        };

        $(me).unbind("click", inputClickEvent);
        $(me).bind("click", inputClickEvent);
    };
    //传入的是数组获取是一个对象都可以
    jQuery.each(this, function () {
        initBtn.call(this, config);
    });
};

var DropDownBtn = function () {
    this.config = {
        bFocusFireDropFun: true,
        fnBeforeDrop: $.noop, //事件传入一个参数，就是绑定的输入对象（input对象），并且参数名为：inputEl
        fnDrop: $.noop, //事件传入一个参数，就是绑定的输入对象（input对象），并且参数名为：inputEl
        fnAfterDrop: $.noop, //事件传入一个参数，就是绑定的输入对象（input对象），并且参数名为：inputEl
        disableAllEvent: false //是否禁止所有的事件
    };
};

DropDownBtn.htmlTemplate = '<span class="{0}" inputID="{1}"><input type="button" value="6" class="{0}"/></span>';